<template>
	<block>
		<hxt-layout id="hxt-layout" title="用户" svc="fingerPrint" initTitle="用户加载失败" @initPage="initPage">
			<view class="hxt-flex-column" style="background-color: #F5F5F5;">
				<view class="hxt-flex-fill" style="height: 1px;">
					<hxt-scroll ref="scrollEL" id="scrollEL" scroll-y style="height:100%;" scroll-with-animation="true"
						enable-back-to-top="true" :enhanced="true" :bounces="false" @loadData="loadData">
						<view v-for="(item,index) in list" :key="index">
							<van-swipe-cell :right-width="65" async-close
								@close="onSwipeClose($event,item.openId,index)">
								<van-cell @click="Add(item)" use-label-slot>
									<view slot="title" class="hxt-flex" style="justify-content: space-between;">
										<view class="van-cell-text">{{item.openId}}</view>
										<text v-if="currentUser.openId==item.openId"
											class="tn-icon-creative tn-green-disabled_text"
											style="font-size: 25px;"></text>
									</view>
									<view slot="label" class="hxt-flex">
										<view style="width: 150rpx;">{{item.uiName}}</view>
										<view style="width: 300rpx;text-align: center;">{{item.account}}</view>
										<view class="hxt-flex-fill text-right">{{item.wxTime}}</view>
									</view>
								</van-cell>
								<view slot="right" style="height: 100%;" class="van-swipe-cell__right">
									<van-button style="height: 100%;" block type="danger">删除</van-button>
								</view>
							</van-swipe-cell>
						</view>
					</hxt-scroll>
				</view>
			</view>
		</hxt-layout>
		<page-container v-if="dialog" :show="dialog" position="center" @clickoverlay="closeAdd" @afterleave="closeAdd">
			<view class="hxt-flex-column">
				<view class="hxt-flex-fill" style="height: 1px;">
					<scroll-view scroll-y style="height:100%;background-color: #F5F5F5;" enable-back-to-top="true"
						:enhanced="true" :bounces="false">
						<view style="padding: 1rpx 0;">
							<view style="background-color: #FFFFFF;padding: 30rpx;margin: 20rpx;border-radius: 15rpx;">
								<view class="padding-bottom">
									<text class="text-red">*</text>
									<text style="font-weight: bold;">openId</text>
									<!-- <text v-if="!!item.gkMark">（{{item.gkMark}}）</text> -->
								</view>
								<view class="inputborder">
									<hxt-input disabled :border="false" v-model="form.openId" placeholder="请输入openId">
									</hxt-input>
								</view>
							</view>
							<view style="background-color: #FFFFFF;padding: 30rpx;margin: 20rpx;border-radius: 15rpx;">
								<view class="padding-bottom">
									<text class="text-red">*</text>
									<text style="font-weight: bold;">session_key</text>
									<!-- <text v-if="!!item.gkMark">（{{item.gkMark}}）</text> -->
								</view>
								<view class="inputborder">
									<hxt-input disabled :border="false" v-model="form.session_key"
										placeholder="请输入session_key">
									</hxt-input>
								</view>
							</view>
							<view style="background-color: #FFFFFF;padding: 30rpx;margin: 20rpx;border-radius: 15rpx;">
								<view class="padding-bottom">
									<text class="text-red">*</text>
									<text style="font-weight: bold;">密码</text>
									<!-- <text v-if="!!item.gkMark">（{{item.gkMark}}）</text> -->
								</view>
								<view class="inputborder">
									<hxt-input disabled :border="false" v-model="form.pwd" placeholder="请输入密码">
									</hxt-input>
								</view>
							</view>
							<view style="background-color: #FFFFFF;padding: 30rpx;margin: 20rpx;border-radius: 15rpx;">
								<view class="padding-bottom">
									<text class="text-red">*</text>
									<text style="font-weight: bold;">用户名</text>
									<!-- <text v-if="!!item.gkMark">（{{item.gkMark}}）</text> -->
								</view>
								<view class="inputborder">
									<hxt-input :border="false" v-model="form.uiName" placeholder="请输入用户名">
									</hxt-input>
								</view>
							</view>
							<view style="background-color: #FFFFFF;padding: 30rpx;margin: 20rpx;border-radius: 15rpx;">
								<view class="padding-bottom">
									<text class="text-red">*</text>
									<text style="font-weight: bold;">账号</text>
									<!-- <text v-if="!!item.gkMark">（{{item.gkMark}}）</text> -->
								</view>
								<view class="inputborder">
									<hxt-input :border="false" v-model="form.account" placeholder="请输入账号">
									</hxt-input>
								</view>
							</view>
							<view style="background-color: #FFFFFF;padding: 30rpx;margin: 20rpx;border-radius: 15rpx;">
								<view class="hxt-flex">
									<view class="hxt-flex-fill">
										<text class="text-red">*</text>
										<text style="font-weight: bold;">最高权限</text>
									</view>
									<van-switch :disabled="!currentUser.root" :checked="form.root" :active-value="1"
										:inactive-value="0" inactive-color="#DCDEE0" size="24px"
										@change="onChange"></van-switch>
									<!-- <text v-if="!!item.gkMark">（{{item.gkMark}}）</text> -->
								</view>

							</view>
						</view>
					</scroll-view>
				</view>
				<view class="hxt-flex" style="padding: 20rpx;">
					<button class="cu-btn round bg-cyan shadow" @click="submit"
						style="background-color: #1cbbb4;width: 100%;">保存</button>
				</view>
			</view>
		</page-container>

		<hxt-loading id="hxt-loading"></hxt-loading>
	</block>
</template>
<script>
	import hxt from "@/utils/hxt.js"
	export default {
		data() {
			const app = getApp();
			return {
				form: {
					optType: 0,
					uiId: '0',
					fId: '',
					uId: '',
					state: 'bill,engineOil',
					uiName: '',
					cpu_id: '',
					pwd: '',
					oimodel: '',
					oibrand: '',
					oiplatform: ''
				},
				query: {
					pageIndex: 1,
					pageSize: 30,
					rowCount: 0,
				},
				list: [],
				oldform: '',
				dialog: false,
				currentUser: app.globalData.currentUser,
			}
		},
		onShow: function(e) {},
		methods: {
			initPage: function(e) { //初始化事件
				var _this = this;
				_this.loadData();
			},
			loadData: function(e) {
				var _this = this;
				if (!e || e.refresh) {
					_this.query.pageIndex = 1;
				};
				hxt.post({
					url: hxt.domain + 'pc/userList',
					data: {
						pageIndex: _this.query.pageIndex,
						pageSize: _this.query.pageSize
					},
					ok: function(res) {
						if (res.data.code != 0) {
							hxt.Notify({
								type: 'danger',
								message: '加载失败：' + res.data.errmsg + '，请稍后重试！'
							});
							_this.$refs.scrollEL.refreshDone(false);
							_this.list = [];
							return;
						};
						var list = _this.query.pageIndex == 1 ? [] : _this.list;
						_this.list = list.concat(res.data.data.list);
						_this.$refs.scrollEL.refreshDone(_this.query.pageIndex <= (
							parseInt(res.data.data.rowCount / res.data.data.pageSize)));
						_this.query.pageIndex++;
						_this.query.pageSize = res.data.data.pageSize;
						_this.query.rowCount = res.data.data.rowCount;
					},
					fail: function(res) {
						hxt.Notify({
							type: 'danger',
							message: '加载失败：' + res.errMsg + '，请稍后重试！'
						});
						_this.$refs.scrollEL.refreshDone(false);
						_this.list = [];
					}
				});

			},
			Add: function(g) {
				var _this = this;
				if (!hxt.canDo(30601)) return hxt.Notify({
					type: 'warning',
					message: '无权限'
				});
				_this.form = g;
				_this.form.optType = 1;
				_this.oldform = JSON.stringify(_this.form);
				_this.dialog = true;
			},
			onChange: function(e) {
				var _this = this;
				_this.form.root = e.detail;
			},
			closeAdd: function(e) {
				var _this = this;
				_this.dialog = false;
				_this.form.optType = 0;
			},
			onSwipeClose: function(e, openId, index) {
				var _this = this,
					{
						position,
						instance
					} = e.detail;
				hxt.confirm("注意：删除后不能找回", "确定删除吗?", function() {
					hxt.post({
						url: hxt.domain + "pc/getUserInfo",
						data: {
							optType: 2,
							openId: openId,
						},
						ok: function(res) {
							if (res.data.code != 0) {
								hxt.Notify({
									type: 'danger',
									message: '删除失败：' + res.data.errmsg
								});
								return;
							};
							hxt.Notify({
								type: 'success',
								message: '删除成功',
								duration: 1000
							});
							_this.list.splice(index, 1);
						},
						fail: function(res) {
							hxt.Notify({
								type: 'danger',
								message: '删除失败：' + res.errMsg
							});
						}
					});
					instance.close();
				}, function() {
					instance.close();
				});
			},
			submit: function(e) {
				var _this = this,
					form = _this.form;
				form.oiId = _this.currentUser.openId;
				if (_this.oldform == JSON.stringify(form)) return hxt.Notify({
					type: 'warning',
					message: '保存失败：信息未更改'
				});
				hxt.post({
					url: hxt.domain + "pc/getUserInfo",
					data: form,
					ok: function(res) {
						if (res.data.code != 0) {
							hxt.Notify({
								type: 'danger',
								message: '保存失败：' + res.data.errmsg
							});
							return;
						};
						hxt.Notify({
							type: 'success',
							message: '保存成功',
							duration: 1000
						});
						_this.loadData();
						_this.closeAdd();
					},
					fail: function(res) {
						hxt.Notify({
							type: 'danger',
							message: '保存失败：' + res.errMsg
						});
					}
				});
			}
		}
	}
</script>

<style>
	.inputborder {
		border: 2rpx solid #e5e5e5;
		border-radius: 8rpx;
		background-color: #fff;
		padding: 1rpx 10rpx;
	}

	.van-cell {
		padding: 10rpx !important;
	}

	.txt-css {
		word-break: break-all;
		word-wrap: break-word;
		white-space: pre-line;
	}

	.submit-bar {
		position: sticky !important;
		z-index: 0 !important;
	}

	.van-button {
		height: 100% !important;
	}
</style>